<template>
  <div class="carousel">
    <box-title title="资源统计"></box-title>

    <el-carousel
      height="200px"
      indicator-position="none"
    >
      <el-carousel-item
        v-for="item in 1"
        :key="item"
      >
        <div class="carousel-item flex">
          <div class="flex-1  item-bar">
            <box-bar
            title="广东省发展研究中心"

              :datas="carousel"
              :id="'id1'+item"
            ></box-bar>
            <div class="text">xxxx</div>
          </div>
          <div class="flex-1 item-bar">
            <box-bar
            title="广东省发展研究中心"
              :datas="carousel"
              :id="'id2'+item"
            ></box-bar>
            <div class="text">xxxx</div>

          </div>
          <div class="flex-1 item-bar">
            <box-bar
            title="广东省发展研究中心"

              :datas="carousel"
              :id="'id3'+item"
            ></box-bar>
            <div class="text">xxxx</div>

          </div>
        </div>
      </el-carousel-item>
    </el-carousel>
  </div>
</template>
<script>
import boxTitle from "../components/title";
import boxBar from "../components/bar";
import base from "../mixins/index";
export default {
  mixins: [base],
  components: { boxTitle, boxBar },
};
</script>
<style lang="less" scoped>
@import url("../styles/main.less");

.carousel {
  height: 255px;
  .block-box;
  .carousel-item {
    height: 100%;
  }
  .item-bar {
    height: 100%;
  }
  .text {
    .data-color;
  }
}
</style>